import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:qgchat/common/global/global.dart';
import 'package:qgchat/page/my/releaseDynamic/BloC/releaseDynamicBloC.dart';
import 'package:qgchat/widgets/uploadImg.dart';

class UploadImgView extends StatelessWidget {
  const UploadImgView({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      width: flex1,
      color: Colors.white,
      padding: EdgeInsets.all(px(30)),
      child: BlocBuilder<ReleaseDynamicBloc, List<String>>(
        builder: (context, state) {
          return Wrap(
            spacing: px(28),
            runSpacing: px(28),
            runAlignment: WrapAlignment.spaceBetween,
            children: state.asMap().keys.map<Widget>((i) {
              return imgView(context, state[i], i);
            }).toList()
              ..add(addView(context)),
          );
        },
      ),
    );
  }

  /// 新增图片按钮
  Widget addView(context) {
    return Container(
      width: px(115),
      height: px(115),
      decoration: BoxDecoration(
        border: Border.all(
          color: col("edeff2"),
          width: 1,
        ),
      ),
      child: FlatButton(
        onPressed: () async {
          BlocProvider.of<ReleaseDynamicBloc>(context).focus.unfocus();
          int count = BlocProvider.of<ReleaseDynamicBloc>(context).imgsLength;
          if (count >= 9) {
            showToast("最多上传9张图哦");
            return;
          }
          if (BlocProvider.of<ReleaseDynamicBloc>(context).loding) {
            showToast("正在上传中...");
            return;
          }

          int i = await UploadImg.pick(context, (String url) {
            BlocProvider.of<ReleaseDynamicBloc>(context).addImg(url);
            BlocProvider.of<ReleaseDynamicBloc>(context)
                .add(ReleaseDynamicEvent.reset);
            Scaffold.of(context).hideCurrentSnackBar();
            BlocProvider.of<ReleaseDynamicBloc>(context).focus.unfocus();
          });
          if (i == null) return;
          BlocProvider.of<ReleaseDynamicBloc>(context).loding = true;
          Scaffold.of(context)
            ..hideCurrentSnackBar()
            ..showSnackBar(
              SnackBar(
                content: Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text('图片上传中，请等待...'),
                    CircularProgressIndicator(),
                  ],
                ),
                duration: Duration(days: 1),
              ),
            );
        },
        padding: EdgeInsets.zero,
        child: Icon(
          Icons.add,
          color: col("bfc2cc"),
          size: px(100),
        ),
      ),
    );
  }

  /// 单张图片
  Widget imgView(BuildContext context, String url, int i) {
    return Container(
      width: px(115),
      height: px(115),
      child: FlatButton(
        onPressed: () {
          showDialog(
              context: context,
              builder: (BuildContext ctx) {
                return CupertinoAlertDialog(
                  title: Text("删除这张图片吗？"),
                  actions: <Widget>[
                    CupertinoDialogAction(
                      child: Text("取消"),
                      onPressed: () {
                        Navigator.pop(ctx);
                      },
                    ),
                    CupertinoDialogAction(
                      child: Text("确定"),
                      onPressed: () {
                        BlocProvider.of<ReleaseDynamicBloc>(context).delImg(i);
                        BlocProvider.of<ReleaseDynamicBloc>(context)
                            .add(ReleaseDynamicEvent.reset);
                        Navigator.pop(ctx);
                      },
                    ),
                  ],
                );
              });
        },
        padding: EdgeInsets.zero,
        child: CachedNetworkImage(
          imageUrl: "$url",
          fit: BoxFit.cover,
          errorWidget: (context, url, error) {
            return Config.errorNetImage;
          },
        ),
      ),
    );
  }
}
